﻿@model DrillOnline.Services.DrillScenarios

@{
    ViewBag.Title = "Index";
}

@section scripts {

    <script src="~/Scripts/jquery.signalR-2.0.0.min.js"></script>
    <script src="~/Scripts/jquery-ui-1.10.3.js"></script>

    <script src="~/signalr/hubs"></script>

    <script type="text/javascript">
        
        $(function () {

            var scenario = $.connection.drillEventHub;

            scenario.client.StatusChange = function (Now, IsReady, Status) {
                updateStatus(Now,IsReady,Status);
            }
            scenario.client.PlayIndexChange=function(Now,ST,PO,SortIndex,Offset){
                updatePlayIndex(Now,ST,PO,SortIndex,Offset);
            }
            $.connection.hub.start().done(function () {
                updateStatus(null, @(ThisSession.IsReady ? "true" : "false"), @(ThisSession.Timeline.Status));
                try{
                    updatePlayIndex('@(DateTime.Now.ToUniversalTime())','@(ThisSession.Timeline.StoryBaseTime.AddSeconds(ThisSession.Timeline.PlayingOffset).ToUniversalTime())',@(ThisSession.Timeline.PlayingOffset),@(ThisSession.SceneList[@ThisSession.Timeline.PlayingSceneIndex].Model.SortIndex) ,null);
                }catch(e){
                }
                
            });
        });
        function updatePlayIndex(Now,ST,PO,SortIndex,Offset){
            
            $("#prop_crt").text(new Date(Date.parse( Now)).toLocaleString());
            $("#prop_cst").text(new Date(Date.parse(ST)).toLocaleString());
            var po=new Date(PO*1000);
            $("#prop_et").text(""+(po.getDate()-1)+"天"+(po.getHours()-8)+"小时"+po.getMinutes()+"分"+po.getSeconds()+"秒");
    
        }
        
        function updateStatus(Now, IsReady, Status) {
            var t = "";
            var s = 0; var c = 0;
            if (!IsReady) {
                t = "未开始";
                s = 0;
            } else {
                s = 1;
                c = Status;
                if (Status == 0) {
                    t = "已停止";
                } else if (Status == 1) {
                    t = "已暂停";
                } else if (Status == 2) {
                    t = "进行中";
                }
            }
            $("#playstatus").text("["+t+"]");
            if (IsReady) {
                $('#controller').slideDown('slow');
            } else {
                $('#controller').slideUp('slow');
            }

            $("#ctrlpanel button").removeClass("hl");
            $("#ctrlpanel button#s" + s).addClass("hl");
            $("#ctrlpanel button#c" + c).addClass("hl");
        }

    </script>
}


<section style="float: left; width: 40%; min-height: 400px">
    <section id="menuol" class="bg-white" style="float: right; width: 100%; margin-right: 4px; padding: 0px 8px 8px 8px;">
        @{
            var su = ScenariosUser;
        }
        <table class="bg-white" style="width: 100%; padding: 16px;">
            <tr>
                <td style="padding: 8px;">
                    <div class="Flag Flag-Big">@su.Group.Model.Flag</div>
                </td>
                <td style="" colspan="2">
                    <h2>@Html.DisplayFor(m => su.GroupKey)</h2>
                </td>
            </tr>
            <tr style="border-top: 2px solid lightgray;">
                <td style=""></td>
                <td style="padding: 8px;">
                    <h2>我：@su.ActorKey</h2>
                    <br />
                    <h3>同组成员名单</h3>
                    <h4>
                        @string.Join(",", ThisSession.ActorGroups.First(v => v.GroupKey == su.GroupKey).Examiners .Select(v => v.ActorKey).ToArray())</h4>
                </td>

            </tr>

        </table>


    </section>
</section>

<section style="float: right; width: 60%; min-height: 400px">
    <section id="itemol" class="bg-white" style="float: left; width: 100%; margin-left: 4px; padding: 0px 8px 8px 8px;">
        <table>
            <tr>
                <td>
                    <p class="prop">
                        <label>发生时刻</label>@Model.Subject.StoryBaseTime.ToString("yyyy年MM月dd日HH点mm分")
                    </p>
                    <p class="prop">
                        <label>事件时长</label>@TimeSpan.FromSeconds(Model.Subject.TotalPlayingSec).ToString()
                    </p>
                    <p class="prop">
                        <label>演练速度</label>1 : @Model.Subject.PlayingRate
                    </p>


                </td>
                <td>

                    <p class="prop">
                        <label>当前时间</label><span id="prop_crt">@Model.Timeline.RealCurrentTime.ToString("yyyy年MM月dd日HH点mm分")</span>
                    </p>
                    <p class="prop">
                        <label>当前时间</label><span id="prop_cst">@Model.Timeline.RealCurrentTime.ToString("yyyy年MM月dd日HH点mm分")</span>
                    </p>
                    <p class="prop">
                        <label>震后时间</label><span id="prop_et">@TimeSpan.FromSeconds(Model.Timeline.PlayingOffset).ToString()</span>
                    </p>

                </td>
            </tr>
        </table>
        <hr />
        <div class="button">@Html.ActionLink("开始评估", "CtrlPanel")</div>
        @*        <button>@Html.ActionLink("刷新状态", "Index")</button>*@
        <hr />

        <pre>@Html.DisplayFor(m => Model.Subject.Description)</pre>

    </section>
</section>